//定义请求时的动画
//定义请求拦截器和响应拦截器
import axios from 'axios'
import { Loading, Message } from 'element-ui'
import router from '../router'

let loading = null
// 动画开始
function startLoading() {
  loading = Loading.service({
    lock: true,
    text: '拼命加载中...',
    background: "rgba(0,0,0,0.7)"
  })
}
// 动画结束
function endLoading() {
  loading.close()
}

//定义一个请求拦截器
axios.interceptors.request.use(config => {
  //发送请求之前做的事情
  //加载动画
  startLoading()
  //每次判断token是否存在
  //存在则每次请求携带这个token
  if(localStorage.eleToken) {
    config.headers.Authorization = localStorage.eleToken
  }
  return config
}, (error) => {
  //执行错误执行的操作
  console.log(error)
  return Promise.reject(error)
})

//定义一个响应拦截器
axios.interceptors.response.use(response => {
  //关闭动画
  endLoading()
  return response
}, error => {
  endLoading()
  //token过期
  const { status } = error.response
  console.log(status)
  if(status == 401) {
    Message.error('登录过期,请重新登录')
    //清除token
    localStorage.removeItem('eleToken')
    //跳转到登陆页面
    router.replace('/login')
  }
  return Promise.reject(error.response.data)
})

export default axios